import React from 'react';
import ReactDom from 'react-dom';
import { useHistory } from 'react-router-dom';
import ZIndex from '@/components/ZIndex';
import { empty } from '@/common/utils';

import styles from './style.scss';

const ActivityDownload = ({ onClose, visible }) => {
  const history = useHistory();

  const onPathJumpHandle = () => history.push('/download');

  if (!visible) return null;
  return ReactDom.createPortal((
    <ZIndex className={styles.container} onClick={onClose}>
      <div className={styles.content}>
        <section className={styles.box}>
          <p>下载鑫球直播</p>
          <p>兑换商城豪礼</p>
          <button type="button" className={styles.button} onClick={onPathJumpHandle}>立即下载</button>
        </section>
      </div>
    </ZIndex>
  ), document.body);
};

ActivityDownload.defaultProps = {
  onClose: empty,
};

export default ActivityDownload;
